@charset "utf-8";
header {
    position          : fixed;
    top               : 0;
    width             : 100%;
    border            : solid 1px #AAAAAA;
    background        : url("./../../../img/mlit_icon2.png"), -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #cccccc), color-stop(0.00, #ffffff));
    background-repeat : no-repeat;
    background-size   : contain;
}

body {
    margin           : 66px 0 0 0;
    padding          : 0;
    min-width        : 1000px;
    display          : inline-block;
    width            : 100%;
    height           : 100%;
    background-color : white;
    font-size        : 13px;
}

h2.sub-title{
    margin-top    : 0;
    margin-bottom : 0;
    float         : left;
    text-align    : left;
    font-size     : 20px;
    font-weight   : bold;
    color         : #2363C3;
}

h2.sub-title img {
    width : 40%;
}

div#leafletFrame {
    position : absolute;
    top      : 0;
    right    : 0;
    bottom   : 0;
    left     : 0;
}

div#leafletFrame img{
    cursor : pointer;
}

div.leaflet-top .leaflet-control {
    margin-top : 100px;
}

ul {
    list-style : none;
    padding    : 0;
    margin     : 0;
}

table#calendarTable thead tr th, table#calendarTable tbody tr td {
    text-align : center;
}

section.box_margin {
    margin : 20px;
}

img[usemap] {
    width  : auto;
    height : 100%;
}

div.wrap {
    padding    : 20px 40px;
    max-width  :1920px;
    margin     : 0 auto;
    background : #FFFFFF;
    z-index: 100;
}

hr.separation{
    clear      : both;float: none;
    border-top : 1px dotted #2363C3;
    margin     : 20px auto;
}

#sideMenuRegulation {
    z-index        : 300;
    padding        : 10px;
    background     : #ffffff;
    height         : 100%;
    overflow-y     : scroll;
    position       : absolute;
    top            : 0;
    padding-bottom : 40px;
    white-space    : nowrap;
}

div#listHeadDiv {
    display : flex;
}

div#submenuArea {
    display       : flex;
    margin-bottom : 5px;
    width         : 60%;
}

input[name="changeListButton"] {
    display : none;
}

input[type="radio"]:checked + label {
    background : #2363C3;
}

#sideMenuRegulation p.menuTitle {
    color       : #2363C3;
    font-weight : bold;
    text-align  : left;
    font-size   : 15px;
    padding     : 5px 10px;
    margin      : 0;
    width       : 10em;
    display     : inline-block;
}

label.changeListButtonName {
    width            : 14em;
    margin           : 0px 5px;
    padding          : 5px 10px;
    color            : #FFFFFF;
    background-color : #DDDDDD;
    border-radius    : 5px;
    font-size        : 12px;
    display          : flex;
    justify-content  : center;
    align-items      : center;
    float            : left;
    white-space      : nowrap;
    cursor           : pointer;
}

div#seibikyokuDiv {
    text-align : right;
    width      : 40%;
}

select#selectSeibikyoku {
    margin  : 0 5px;
    padding : 5px;
    cursor  : pointer;
}

#sideMenuRegulation div.tableLine {
    display : flex;
    cursor  : pointer;
}

#sideMenuRegulation span.itemName {
    width            : 16%;
    padding          : 5px 10px;
    background-color : #373E79;
    color            : #fff;
    font-size        : 0.9em;
    text-align       : center;
}

#sideMenuRegulation span.tdItem {
    padding    : 5px 25px;
    width      : 26%;
    color      : #fff;
    background : #2363C3;
}

#sideMenuRegulation span.tdItem:last-child {
    width : 6%;
}

#sideMenuRegulation span.triangle {
    font-size : 20px;
}

#sideMenuRegulation div.submenu {
    background : url("../img/sidemenu_back.png")repeat;
    padding    : 10px 20px;
}

#sideMenuRegulation p.submenuTitle {
    text-align    : left;
    font-size     : 15px;
    padding       : 15px 0 0 15px;
    margin-bottom : 0.3rem;
    float         : left;
}

#sideMenuRegulation table {
    border : 1px solid #ccc;
    clear  : both;
    width  : 100%;
}

#sideMenuRegulation table td {
    font-size        : 11px;
    line-height      : 20px;
    padding          : 3px;
    background-color : #fff;
    text-align       : center;
}

span.strFull {
    display       : none;
    padding       : 5px;
    border-radius : 5px;
    max-width     : 235px;
    background    : #CCCCCC;
    color         : #000000;
    font-weight   : bold;
    white-space   : initial!important;
    position      : absolute;
}

#regListTab {
    position : absolute;
    left     : 0;
    top      : 0;
    z-index  : 300;
    cursor   : pointer;
}

#regListTab img {
    width : 29px;
}

#regListTab img.tab-open {
    display : none;
}

.hanrei-tab .tab-close {
    display : none;
}

div.hanrei-block {
    z-index    : 250;
    padding    : 10px;
    background : #ffffff;
    position   : absolute;
    width      : 200px;
    right      : 0px;
    top        : 0;
}

.hanrei-tab {
    position : absolute;
    right    : 200px;
    top      : 0;
    z-index  : 240;
    cursor   : pointer;
}

.hanrei-tab img {
    width : 30px;
}

div.hanreiImgDiv,
div.hanreiInputDiv,
div.hanreiNameDiv {
    display : inline;
}

button#btnSetumei {
    background-image  : url('./../img/hr12.gif');
    background-repeat : no-repeat;
    font-size         : 12px;
    width             : 160px;
    height            : 30px;
    border            : none;
    padding-left      : 14px;
}

div#title {
    margin           : 10px;
    font-size        : 150%;
    color            : #ffffff;
    background-color : #696969;}

div#tContents,
div#kContents {
    margin : 10px;
}

div#tContents table,
div#kContents table {
    width : 100%;
}

div#tContents table thead tr {
    background-color : #f08080;
}

div#kContents table thead tr {
    background-color : #ffa500;
}

th#type {
    width      : 30%;
    text-align : center;
}

th#naiyo {
    width      : 70%;
    text-align : center;
}

div#tContents table tbody tr td,
div#kContents table tbody tr td {
    padding : 5px;
}

p.rosenmei {
    float       : left;
    text-align  : left;
    font-size   : 15px;
    font-weight : bold;
    padding     : 0 5px ;
    border-left : 5px solid #000;
    margin      : 10px 0 0 0 ;
}

div.ImgChg {
    float  : right;
    margin : 0;
}

div.ImgChg ul li {
    float      : left;
    margin     : 5px 0 5px 10px;
    text-align : center;
}

div.ImgChg button {
    font-size           : 13px;
    position            : relative;
    display             : inline-block;
    padding             : 5px;
    cursor              : pointer;
    -webkit-user-select : none;
    -moz-user-select    : none;
    -ms-user-select     : none;
    user-select         : none;
    -webkit-transition  : all 0.3s;
    transition          : all 0.3s;
    text-align          : center;
    vertical-align      : middle;
    text-decoration     : none;
    border-radius       : 0.3rem;
    width               : 100px;
}

button.selectedImgChgbtn {
    color      : #ffffff!important;
    background : -webkit-gradient(linear, left top, left bottom, from(#5B5B5B), to(#6D6D6D))!important;
}

button.ImgChgbtn {
    color      : #000;
    border     : none;
    background : -webkit-gradient(linear, left top, left bottom, from(#DFDFDF), to(#ccc));
}

button.ImgChgbtn:hover {
    color      : #000;
    background : #ccc;
    background : -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#C0C0C0));
    background : -moz-linear-gradient(top, #ccc, #C0C0C0);
    background : -ms-linear-gradient(top, #ccc, #C0C0C0);
    -ms-filter : "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ccc', endColorstr='#C0C0C0', GradientType=0)";
}

div.imagePop-modal-content {
    background    : #000000;
    left          : 50%;
    position      : absolute;
    top           : 30%;
    transform     : translate(-50%, -30%);
    border        : 1px solid #111;
    border-radius : 20px;
    width         : 950px;
    padding       : 10px;
}

div#popUpTitle_gazo {
    width       : 100%;
    margin      : 0px auto 3px;
    font-size   : 15px;
    font-weight : bold;
    padding     : 0.5rem 0;
    text-align  : center;
    color       : #fff;
    background  : #553F94;
}

p#updateTime{
    float         : none;
    clear         : both;
    text-align    : right;
    font-size     : 13px;
    margin-bottom : 0!important;
    margin-top    : 0!important;
}

.pop-left {
    float  : left;
    width  : 50%;
    margin : 0;
}

.pop-right {
    float  : right;
    width  : 50%;
    margin : 0;
}

img#doroImage {
    display : block;
    width   : 100%;
    height  : 330px;
    padding : 0px 5px 0px 5px;
}

div#imagePopLeafletFrame {
    width            : 100%;
    height           : 223px;
    background-color : #AAFFAA;
}

div#imagePopLeafletFrame img.leaflet-marker-icon{
    pointer-events : none;
}

table.imagePop-table{
    font-size : 13px;
    width     : 100%;
    padding   : 0px 5px 0px 5px;
}

table.imagePop-table tbody tr.kansokuTime {
    text-align : center;
    padding    : 0.5rem;
    background : #553F94;
    color      : #fff;
    height     : 20px;
}

table.imagePop-table tbody tr td.shosaiTitle {
    width      : 25%;
    text-align : left;
    color      : #fff;
    padding    : 0.5rem;
    background : #6D6D6D;
}

table.imagePop-table tbody tr td.shosaiValue {
    width      : 25%;
    text-align   : left;
    color        : #000;
    padding      : 0.5rem;
    background   : #DFDFDF;
    border-right : 1px solid #fff;
}

p#usage{
    padding       : 10px 0;
    clear         : both;
    text-align    : center;
    font-size     : 14px;
    line-height   : 1.7em;
    margin-bottom : 0!important;
    margin-top    : 0!important;
}

p#usage span{
    color           : #FF0000;
    text-decoration : underline;
}

div#telopFrame {
    height      : 30px;
    position    : fixed;
    bottom      : 50px;
    right       : 0;
    left        : 0;
    z-index     : 500;
    font-weight : bold;
    font-size   : 18px;
}

div.telopFramePurple {
    background-color : #C800FF!important;
    color            : #FFFFFF
}

div.telopFrameRed {
    background-color : #FF2800!important;
    color            : #FFFFFF
}

div.telopFrameYellow {
    background-color : #FAF500!important;
}

div.telopFrameNone {
    visibility : hidden;
}

span#marqueeText {
    /* 通常CSS */
    display    : inline-block;
    margin-top : 3px;
    /* マーキーアニメーションCSS */
    animation-name            : marquee;
    animation-duration        : 15s;
    animation-timing-function : linear;
    animation-iteration-count : infinite;
}

footer {
    width: 100%;
    
    background-color: #ffffff;
    padding: 0px 0;


    position: absolute;/*←絶対位置*/
    bottom: 0; /*下に固定*/
    z-index: 1;
}

footer p {
    border-top          : solid 1px #AAAAAA;
    background          : url("./../../../img/mlit_icon2.png");
    background-repeat   : no-repeat;
    background-size     : contain;
    background-position : left;
    font-size           : 13px;
}
span#corporation {
    margin-left: 25px;
}
footer div { 
    width     : 100%;
    font-size : 13px;
}

footer div table {
    width      : inherit;
    border-top : solid 1px #AAAAAA;
}

footer div table tr:first-child td:first-of-type {
    text-align : right;
}

footer img { 
    width  : 133px;
    height : 36px;
}

.modal {
    display  : none;
    height   : 100vh;
    position : fixed;
    top      : 0;
    width    : 100%;
    left     : 0;
    z-index  : 1000;
}

.modal-bg {
    background : rgba(16,16,16,0.8);
    height     : 100vh;
    width      : 100%;
    z-index    : 990;
}

.modal-content {
    background    : #000000;
    left          : 50%;
    position      : absolute;
    max-height    : 600px;
    top           : 30%;
    transform     : translate(-50%, -145px);
    border        : 1px solid #111;
    border-radius : 20px;
    width         : 1000px;
    padding       : 10px;
}

.modal-content-header {
    color    : #fff;
    padding  : 0px 0px 0px 8px;
    position : relative;
}

.modal-content-inner {
    position   : relative;
    background : #fff;
    margin     : 10px;
    padding    : 5px;
}

.modal-content-footer {
    text-align : right;
    padding    : 0px 5px;
}

.modal-close-btn {
    cursor : pointer;
}

.modal-text-area {
    border     : 1px solid #ff0000;
    padding    : 10px;
    text-align : left;
    color      : #565656;
}

.modal-content-inner h2 {
    font-size   : 16px;
    font-weight : bold;
    color       : #ff0000;
}

.modal-disabled-check-area {
    text-align : right;
    color      : #565656;
}

.modal-disabled-check-area input[type="checkbox"] {
    vertical-align : middle;
    margin-right   : 5px;
}

/*トップへ戻る*/
#backTop {
    position : fixed;
    right    : 50px;
    bottom   : 50px;
    z-index  : 500;
    cursor   : pointer;
}

/*フォント*/
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6,p,div,li,a{
    font-family: Verdana, Roboto,'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
}

/* IEのみCSS記載が変わる場合はここに記載する */
@media all and (-ms-high-contrast: none) {
    body {
        margin-top : 52px;
    }

    header {
        background        : url("./../../../img/mlit_icon2.png"), linear-gradient(#fff,#ccc);
        background-repeat : no-repeat;
        background-size   : contain;
    }
}
